<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>天亮云课堂</title>
</head>
<link rel="stylesheet" href="./css/index.css">
<link rel="stylesheet" href="./css/main.css">
<link rel="shortcut icon" href="./images/favicon.ico">

<body>
    <!-- 外部大盒子 -->
    <div class="box">
        <!-- 遮罩层//登录/注册 -->
        <div class="backgroundBox">
            <!-- 遮罩层 -->
            <div class="background"></div>
            <!-- 登录/注册 -->
            <div class="dengLu">
                <div class="dengLubox">
                    <img src="./images/close.png" alt="" style="right: 6%;position: absolute;top: 5%;cursor: pointer;"
                        id="close">
                    <div class="dengLubox_inner">
                        <div class="dengLubox_inner_top">
                            <span style="border-bottom: 2px solid #00CF8C;color: #00CF8C;" id="span1">普通登录</span><span
                                id="span2">手机登录</span>
                        </div>
                        <!-- 普通登录 -->
                        <div class="dengLubox_Left" id="dengLubox_Left">
                            <input type="text" class="inp1" placeholder="请输入账号">
                            <input type="password" class="inp2" placeholder="请输入密码">
                            <button class="button0">登录</button>
                            <div class="dengLubox_inner_bottom">
                                <span>立即注册！</span><span>忘记密码？</span>
                            </div>
                        </div>
                        <!-- 手机登录 -->
                        <div class="dengLubox_Right">
                            <div class="dengLubox_Left">
                                <input type="text" class="inp1" placeholder="请输入手机号">
                                <span class="get" style="cursor: pointer;">获取验证码</span>
                                <input type="text" class="inp3" placeholder="请输入验证码">
                                <button class="button0">登录</button>
                                <div class="dengLubox_inner_bottom">
                                    <span>立即注册！</span><span>忘记密码？</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 顶部第一部分 -->
        <div class="boxOne">
            <img src="./images/logo.png" alt="" style="width: 16%;vertical-align: middle;" class="logo">
            <input type="text" name="" id="" placeholder="搜索课程" class="search"><span class="span1"><img
                    src="./images/fangdajing.png" alt=""
                    style="width: 30%;vertical-align: middle;margin-left: 10px;margin-left: 5px;"> 搜索</span>
            <span class="span2"><img src="./images/shopCar.png" alt=""></span><span class="span3">登录/注册</span><span
                class="span4"><img src="./images/denglu.png" alt="" style="width: 61%; cursor: pointer;"
                    id="denglu"></span>
        </div>
        <!-- 课程分类 -->
        <div class="boxTwo">
            <span class="current">首页</span>
            <span class="selected0">课程分类<img src="./images/down.png" alt=""></span>
            <span>专属课程</span>
            <ul class="selected">
                <li>&nbsp;&nbsp;留学韩国专题</li>
                <li>&nbsp;&nbsp;学长面对面</li>
                <li>&nbsp;&nbsp;职业素养必修课</li>
                <li>&nbsp;&nbsp;大数据</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
                <li>&nbsp;&nbsp;web前端</li>
            </ul>
        </div>
        <!-- 上方轮播大图 -->
        <div>
            <img src="./images/arrow-left.png" alt="" class="left"><img src="./images/arrow-right.png" alt=""
                class="right">
            <div class="boxThree">
                <ul class="boxThree_inner">
                    <li class="lunBo_image"><img src="./images/bigImage.png" alt=""></li>
                    <li class="lunBo_image"><img src="./images/bigImage4.png" alt=""></li>
                    <li class="lunBo_image"><img src="./images/bigImage2.png" alt=""></li>
                    <li class="lunBo_image"><img src="./images/bigImage3.png" alt=""></li>
                    <li class="lunBo_image"><img src="./images/bigImage.png" alt=""></li>
                </ul>
            </div>
        </div>

        <div style="clear: both;"></div>
        <!-- 直播课程 -->
        <div class="title">直播课程</div>
        <!-- 直播课程下方图 -->
        <div class="boxFour">
            <div class="tab">
                <img src="./images/zhobo1.png" alt="" class="boxFourLeft">
                <div class="boxFourLeft" style="background: bisque;height: 369px;"></div>
                <div class="boxFourLeft" style="background: brown;height: 369px;"></div>
                <div class="boxFourLeft" style="background: navy;height: 369px;"></div>
            </div>

            <div class="boxFourRight">
                <div class="current1" style="background-color: white; border-left: 5px solid #00CF8C;color: #00CF8C;"><a href="./a.html/直播结束1.html" style="color: #000000;"><img src="./images/duihao.png" alt=""><span>直播结束</span><span>研究生复试之高效准备简历的方法</span></a>
                    </div>
                <div class="current1"><img src="./images/duihao.png"
                        alt=""><span>直播结束</span><span>十大经典排序之Part-6-完结篇</span></div>
                <div class="current1"><img src="./images/duihao.png"
                        alt=""><span>直播结束</span><span>jdk1.8-新特性之函数式接口与方法引用</span></div>
                <div class="current1"><img src="./images/bofang.png" alt=""><span style="margin-right: 5%;"> 05-08
                        23:00</span><span>高考之殇与痛则思变</span></div>
            </div>
        </div>
        <!-- 免费课程 -->
        <div class="boxFive">
            <div class="title">免费课程</div>
            <span class="more">更多<img src="./images/more.png" alt=""></span>
        </div>
        <!-- 免费课程下方图 -->
        <div class="boxSix">
            <div class="boxSixOne">
                <div class="boxSix1">
                    <img src="./images/01.png" alt="" class="free_sourse_img">
                    <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #00CF8C;">免费</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/02.png" alt="" class="free_sourse_img">
                    <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #00CF8C;">免费</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/03.png" alt="" class="free_sourse_img">
                    <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #00CF8C;">免费</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/04.png" alt="" class="free_sourse_img">
                    <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #00CF8C;">免费</p>
                </div>
                <div class="boxSix1" style="margin-right: 0px;">
                    <img src="./images/05.png" alt="" class="free_sourse_img">
                    <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #00CF8C;">免费</p>
                </div>
            </div>
            <div style="clear: both;"></div>
            <div class="boxSixOne" style="width: 100%;">
                <div class="boxSixOne">
                    <div class="boxSix1">
                        <img src="./images/06.png" alt="" class="free_sourse_img">
                        <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                        <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                        <p style="color: #00CF8C;">免费</p>
                    </div>
                    <div class="boxSix1">
                        <img src="./images/07.png" alt="" class="free_sourse_img">
                        <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                        <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                        <p style="color: #00CF8C;">免费</p>
                    </div>
                    <div class="boxSix1">
                        <img src="./images/08.png" alt="" class="free_sourse_img">
                        <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                        <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                        <p style="color: #00CF8C;">免费</p>
                    </div>
                    <div class="boxSix1">
                        <img src="./images/09.png" alt="" class="free_sourse_img">
                        <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                        <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                        <p style="color: #00CF8C;">免费</p>
                    </div>
                    <div class="boxSix1" style="margin-right: 0px;">
                        <img src="./images/010.png" alt="" class="free_sourse_img">
                        <p class="free_in_cont_line_tit">web前端基础之html+css</p>
                        <p style="color: #cccccc;" class="free_in_cont_line_data">共56节课丨154人报名</p>
                        <p style="color: #00CF8C;">免费</p>
                    </div>
                </div>
            </div>
        </div>
        <div style="clear: both;"></div>
        <!-- 精品课程 -->
        <div class="boxFive">
            <div class="title">精品课程</div>
            <span class="more">更多<img src="./images/more.png" alt=""></span>
        </div>
        <div class="boxSix">
            <div class="boxSixOne">
                <div class="boxSix1">
                    <img src="./images/01.png" alt="" class="jingpin_sourse_img">
                    <p class="jingpin_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="jingpin_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="jingpin_in_cont_line_newprice">￥99.9</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/02.png" alt="" class="jingpin_sourse_img">
                    <p class="jingpin_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="jingpin_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="jingpin_in_cont_line_newprice">￥99.9</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/03.png" alt="" class="jingpin_sourse_img">
                    <p class="jingpin_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="jingpin_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="jingpin_in_cont_line_newprice">￥99.9</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/04.png" alt="" class="jingpin_sourse_img">
                    <p class="jingpin_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="jingpin_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="jingpin_in_cont_line_newprice">￥99.9</p>
                </div>
                <div class="boxSix1" style="margin-right: 0px;">
                    <img src="./images/05.png" alt="" class="jingpin_sourse_img">
                    <p class="jingpin_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="jingpin_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="jingpin_in_cont_line_newprice">￥99.9</p>
                </div>
            </div>
        </div>
        <div style="clear: both;"></div>
        <!-- 限时折扣课程 -->
        <div class="boxFive">
            <div class="title">限时折扣课程</div>
            <span class="more">更多<img src="./images/more.png" alt=""></span>
        </div>
        <div class="boxSix">
            <div class="boxSixOne">
                <div class="boxSix1">
                    <img src="./images/01.png" alt="" class="xianshi_sourse_img">
                    <p class="xianshi_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="xianshi_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="xianshi_in_cont_line_newprice">￥99.9</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/02.png" alt="" class="xianshi_sourse_img">
                    <p class="xianshi_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="xianshi_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="xianshi_in_cont_line_newprice">￥99.9</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/03.png" alt="" class="xianshi_sourse_img">
                    <p class="xianshi_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="xianshi_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="xianshi_in_cont_line_newprice">￥99.9</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/04.png" alt="" class="xianshi_sourse_img">
                    <p class="xianshi_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="xianshi_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="xianshi_in_cont_line_newprice">￥99.9</p>
                </div>
                <div class="boxSix1" style="margin-right: 0px;">
                    <img src="./images/05.png" alt="" class="xianshi_sourse_img">
                    <p class="xianshi_in_cont_line_tit">web前端基础之html+css</p>
                    <p style="color: #cccccc;" class="xianshi_in_cont_line_data">共56节课丨154人报名</p>
                    <p style="color: #FF4531;" class="xianshi_in_cont_line_newprice">￥99.9</p>
                </div>
            </div>
        </div>
        <div style="clear: both;"></div>
        <!-- 头条精选 -->
        <div class="boxFive">
            <div class="title">头条精选</div>
            <span class="more">更多<img src="./images/more.png" alt=""></span>
        </div>
        <div class="boxSix">
            <div class="boxSixOne">
                <div class="boxSix1">
                    <img src="./images/111.png" alt="">
                    <p>web前端基础之html+css</p>
                    <p style="color: #cccccc;">共56节课丨154人报名</p>
                    <p style="color: #FF4531;">￥99.9</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/222.png" alt="">
                    <p>web前端基础之html+css</p>
                    <p style="color: #cccccc;">共56节课丨154人报名</p>
                    <p style="color: #FF4531;">￥99.9</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/333.png" alt="">
                    <p>web前端基础之html+css</p>
                    <p style="color: #cccccc;">共56节课丨154人报名</p>
                    <p style="color: #FF4531;">￥99.9</p>
                </div>
                <div class="boxSix1">
                    <img src="./images/444.png" alt="">
                    <p>web前端基础之html+css</p>
                    <p style="color: #cccccc;">共56节课丨154人报名</p>
                    <p style="color: #FF4531;">￥99.9</p>
                </div>
                <div class="boxSix1" style="margin-right: 0px;">
                    <img src="./images/555.png" alt="">
                    <p>web前端基础之html+css</p>
                    <p style="color: #cccccc;">共56节课丨154人报名</p>
                    <p style="color: #FF4531;">￥99.9</p>
                </div>
            </div>
        </div>
        <div style="clear: both;"></div>
        <!-- 底部 -->
        <div class="bottom">
            <div class="bottom1">
                <div class="bottom2">友情链接:</div>
            </div>
            <div class="bottom3">
                <ul>
                    <li>星云大数据平台</li>
                    <li>尚云科技</li>
                    <li>iT毕业设计</li>
                    <li>网思安网络安全课堂</li>
                    <li>天亮公开课资源</li>
                </ul>
            </div>
            <div class="bottom4">
                <div>Copyright © 2017-2025 石家庄天亮教育科技有限公司 备案号:冀ICP备17020003号</div>
            </div>
        </div>
        <!-- 右侧固定 -->
        <ul class="ul1">
            <li class="ll">
                <div style="width: 40px;height: 40px;"></div>
                <div>客服1</div>
            </li>
            <li class="ll">
                <div style="width: 40px;height: 40px;"></div>
                <div>客服2</div>
            </li>
            <li class="ll">
                <div style="width: 40px;height: 40px;"></div>
                <div>技术支持</div>
            </li>
        </ul>
    </div>
</body>
<script src="./js/jquery-1.11.1.min.js"></script>
<script src="./js/index.js"></script>

</html>